<template>
	<view class="container">
		<view class="balance-icon">
			<image src="../../static/balance/balance.png" mode="widthFix"></image>
		</view>
		<view class="balance-title">余额</view>
		<view class="balanc-num">
			<text class="text">￥</text>
			<text>{{memberInfo.balance}}</text>
		</view> 
		<view class="invest" @click="goinvest">充值</view>
		<view class="tixian" @click="gotixian">提现</view>
	</view>
</template>

<script>
	import {getUser} from "../../api/user.js"
	export default{
		data(){
			return{
				memberInfo:{}
			}
		},
		onNavigationBarButtonTap() {
			uni.navigateTo({
				url:'/pages/balance/balancedetail'
			})
		},
		onLoad() {
			this.getData()
		},
		onShow() {
			this.getData()
		},
		methods:{
			getData(){	
				this.post(getUser,{
					user_id:uni.getStorageSync("userInfo").id
				}).then(res => {
						if(res.code == 1){
							this.memberInfo = res.data.member_info	
						}
				})
			},
			goinvest(){
				uni.navigateTo({
					url:'/pages/balance/invest'
				})
			},
			gotixian(){
				uni.navigateTo({
					url:'/pages/balance/tixian'
				})
			}
		}
	}
</script>

<style>
	.balance-icon{
		width: 88rpx;
		height: 88rpx;
		margin: 142rpx auto 30rpx;
	}
	.balance-icon>image{
		width: 88rpx;
	}
	.balance-title{
		width: 64rpx;
		height: 45rpx;
		font-size: 32rpx;
		font-weight: 500;
		line-height: 45rpx;
		color: #333333;
		margin: 0 auto;
	}
	.balanc-num{
		width: 750rpx;
		height: 124rpx;
		font-size: 89rpx;
		font-weight: 400;
		color: #333333;
		margin: 20rpx auto;
		text-align: center;
	}
	.text{
		font-size: 39rpx;
	}
	.invest{
		width: 324rpx;
		height: 88rpx;
		background: #008573;
		border-radius: 8rpx;
		margin: 340rpx auto 0;
		font-size: 30rpx;
		font-weight: 400;
		line-height: 88rpx;
		color: #FFFFFF;
		text-align: center;
	}
	.tixian{
		width: 324rpx;
		height: 88rpx;
		background: #EDEDED;
		border-radius: 8rpx;
		font-size: 30rpx;
		font-weight: 400;
		line-height: 88rpx;
		color: #008573;
		text-align: center;
		margin: 37rpx auto;
	}
</style>
